import React from 'react';
import { Icon,Badge } from 'antd-mobile';
import styles from './partTimeNav.css';

const signUpIcon = require('../../../../../../icons/personal/already-sign-up-icon.png');
const admissionIcon = require('../../../../../../icons/personal/alreay-admission-icon.png');
const workIcon = require('../../../../../../icons/personal/already-work-icon.png');
const settlementIcon = require('../../../../../../icons/personal/already-settlement-icon.png');
const myResumeIcon = require('../../../../../../icons/personal/my-resume.png');

const PartTimeNav = ({
  onMyPartTime=()=>{},
  onClickIndex=()=>{},
}) => {

  const tabsList = [{
    id:1,
    label:'已报名',
    imgUrl:signUpIcon,
    indexNum:1
  },{
    id:2,
    label:'已录用',
    imgUrl:admissionIcon,
    indexNum:2
  },{
    id:3,
    label:'已到岗',
    imgUrl:workIcon,
    indexNum:3
  },{
    id:4,
    label:'已结算',
    imgUrl:settlementIcon,
    indexNum:4
  }]

  const bageSize = '';

  return(
    <div className={styles.partTimeNavBody}>

      <div className={styles.title} onClick={() => onMyPartTime(0)}>
        <div  className={styles.leftDIV}>
          {/* <img src={myResumeIcon} /> */}
          <span>我的兼职</span>
        </div>
        <Icon type='right' size='md' color='#6A6A6A' />
      </div>
     <div className={styles.partTimeTabs}>
        {tabsList.map((item, index) => {
          let bageStyle = [`${styles.bageStyle}`];
          // if(bageSize.length > 1){
          //   bageStyle = [`${styles.bageStyle2}`];
          // }
          return (
            <div
              key={item.id.toString()}
              className={styles.tabItem}
              onClick={() => onClickIndex(item.indexNum)}
              >
              <img src={item.imgUrl}/>
              <span>{item.label}</span>
              {bageSize ? (
                <div className={bageStyle.join('')}>{bageSize.length > 2 ? '99+' : bageSize}</div>
              ):''}

            </div>
          )
        })}
      </div>

    </div>
  )
}

export default PartTimeNav;
